<script setup>

import {DocumentChecked, Goods} from "@element-plus/icons-vue";

import 'animate.css';

</script>


<style scoped>
.centered-text {
  overflow: hidden;
  text-align: center; /* 水平居中 */
  margin-top: 20vh; /* 垂直居中，根据需要调整 */
  font-size: 40px;
}

.animate__animated  {
  --animate-duration: 2s;
}

.animate__animated.animate__fadeIn  {
  --animate-duration: 4s;
}


</style>
<template>
  <div class="centered-text">
    <img class="animate__animated animate__backInDown" src="/OIG2.jpg" height="200px" width="200px">
    <h1 class="animate__animated animate__backInLeft">Welcome to MicroLoan!</h1>
    <p  class="animate__animated animate__backInRight">一个安全 可靠 便捷的微型贷款平台</p>
    <br>
    <el-button onclick="window.location.href='../Admin_Layout2/admin_LoanType'" type="danger" style="height: 50px;width: 180px;font-size: large" class="animate__animated animate__fadeIn" round><el-icon class="el-icon--left"  ><Goods /></el-icon>贷款产品预览</el-button>
    &nbsp;&nbsp;&nbsp;
    <el-button onclick="window.location.href='../Admin_Layout2/admin_Loan_Check'" type="primary" style="height: 50px;width: 180px;font-size: large" class="animate__animated animate__fadeIn" round><el-icon class="el-icon--left"><DocumentChecked /></el-icon>贷款申请审核</el-button>
  </div>
</template>





